import 'package:flutter/material.dart';

void main() {
  runApp(MyApp());
}

//自定义组件
class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    // MaterialApp是根组件
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          title: Text('card'),
        ),
        body: HomeContent(),
      ),
      theme: ThemeData(primaryColor: Colors.blue),
    );
  }
}

//ListView无法嵌套ListView所以用column替换,Card可以当成个整体块
class HomeContent extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return ListView(
      children: [
        Card(
          margin: EdgeInsets.all(10),
          child: Column(
            children: [
              //注意加和不加AspectRatio的区别
              AspectRatio(
                aspectRatio: 20 / 9,
                child: Image.asset(
                  "images/independentmind.jpeg",
                  fit: BoxFit.cover,
                ),
              ),
              ListTile(
                leading: Image.asset(
                  "images/independentmind.jpeg",
                  fit: BoxFit.cover,
                ),
                title: Text(
                  "标题",
                  style: TextStyle(fontSize: 28),
                ),
                subtitle: Text("子标题"),
              ),
              ListTile(
                subtitle: Text("地址"),
              ),
            ],
          ),
        ),
        Card(
          margin: EdgeInsets.all(10),
          child: Column(
            children: [
              Image.asset("images/independentmind.jpeg"),
              ListTile(
                leading: ClipOval(
                  child: Image.asset(
                    "images/independentmind.jpeg",
                    fit: BoxFit.cover,
                    height: 60,
                    width: 60,
                  ),
                ),
                title: Text(
                  "标题",
                  style: TextStyle(fontSize: 28),
                ),
                subtitle: Text("描述"),
              ),
              ListTile(
                subtitle: Text("地址"),
              ),
            ],
          ),
        ),
        Card(
          margin: EdgeInsets.all(10),
          child: Column(
            children: [
              Image.asset("images/independentmind.jpeg"),
              ListTile(
                //比ClipOval要园
                leading: CircleAvatar(
                  //如果使用服务端图片用NetworkImage
                  backgroundImage: AssetImage("images/independentmind.jpeg"),
                ),
                title: Text(
                  "标题",
                  style: TextStyle(fontSize: 28),
                ),
                subtitle: Text("描述"),
              ),
              ListTile(
                subtitle: Text("地址"),
              ),
            ],
          ),
        )
      ],
    );
  }
}
